Me doy cuenta de que esta pregunta se ha hecho varias veces, pero nada me ha funcionado...
Estoy tratando de crear una compilación estática de un proyecto create-react-app pero recibo los siguientes errores:
Uncaught SyntaxError: Unexpected token < 1.ca81c833.chunk.js:1 Uncaught SyntaxError: Unexpected token < main.7ced8661.chunk.js:1Debido a que estos archivos están minificados, no estoy seguro de por dónde empezar a depurarlos.
Según otras respuestas de SO, aquí hay algunas cosas que he probado:
//Original index.html file, which gets included in the built file: <script type="text/babel" src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script> //package.json "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1", //.babelrc file { "presets": ["react", "es2015", "stage-1"] }No estoy seguro de si esto es relevante, pero tengo esto en mi servidor express, que creo que es estándar:
if (process.env.NODE_ENV === "production") { app.use(express.static('client/built')); app.get("*", (req, res) => { res.sendFile(require('path') .resolve(__dirname, 'client', 'build', 'index.html')); }) } Suponiendo que en realidad es un problema de JSX, todo es muy confuso: ¿no debería create-react-app manejar JSX automáticamente?
ACTUALIZACIÓN : acabo de publicar esta pregunta pero ya tengo una actualización relevante. Puedo servir la página de forma estática a través de pm2 ejecutando la compilación de pm2 serve build de pm2, por lo que creo que el problema puede estar relacionado con la configuración de mi servidor.
Gracias esto me ayudó mucho. Solo quería agregar a esto un ejemplo de un proyecto Create-React-App que tenía la misma solución: recibí el mismo error después de implementarlo en heroku.
Error de sintaxis no detectado: token inesperado <después del servicio -s compilación
Para mí, el problema estaba en el archivo packages.json. El parámetro "página de inicio" que di era incorrecto. Cambiar esto a la URL heroku correcta resolvió el problema.
"homepage": "https://myapp.herokuapp.com/"Espero que esta adición sea útil.
Terminé encontrando una respuesta aquí: https://github.com/facebook/create-react-app/issues/1812
Recorté la solución completa desde arriba, pero cambié:
app.use(express.static('client/build')); app.get("*", (req, res) => { res.sendFile(require('path') .resolve(__dirname, 'client', 'build', 'index.html')); })para:
const root = require('path').join(__dirname, 'client', 'build') app.use(express.static(root)); app.get("*", (req, res) => { res.sendFile('index.html', { root }); }) Definitivamente es un poco extraño para mí que el primer bloque no funcionó. Supongo que tiene algo que ver con los enlaces relativos en mi proyecto React, ya que recibo un archivo index.html en el navegador, a pesar de recibir el error. Tal vez un archivo completamente estático funcionaría con el primer bloque, pero me interesaría saber si eso es correcto.
solo elimina
"homepage": "la URL de tu aplicación"
de package.json para arreglarlo